<template>
	<view class="order-confirm">
		<mx-navbar :isClearFixed="true" title="悟空商城" />
		<confirm-tip></confirm-tip>
		<view class="main">
			<confirm-addr :receiver="order.receiver" />
			<confirm-goods :goods="order.goods" />
			<confirm-pay :order="order"  @selectCoupon="selectCoupon" />
		</view>

		<view class="foot">
			<view class="fp">
				<view class="c-fl">
					<text class="ctxt"> 共 </text>
					<text class="cnum">
						{{ order.count || 0 }}
					</text>
					<text class="ctxt"> 件 </text>

					<text class="ctxt hj"> 合计 </text>
					<text class="yicon"> ¥ </text>
					<text class="cnum">
						{{ order.payment_amount || 0 }}
					</text>
					<text class="ctxt"> 元 </text>
				</view>
			</view>
			<view class="cu-btn gobtn round shadow-blur" @click="goPay">去支付</view>
		</view>
	</view>
</template>

<script setup>
import confirmTip from "./com/confirm-tip.vue";
import confirmAddr from "./com/confirm-addr.vue";
import confirmGoods from "./com/confirm-goods.vue";
import confirmPay from "./com/confirm-pay.vue";

const { proxy } = getCurrentInstance();

const data = reactive({
	params: {},
	order: {},
	coupon_code: ''
});

const { order, params, coupon_code } = toRefs(data);

onLoad((options) => {
	data.params = options || {};
	getData();
});


async function getData() {
	data.params['coupon_code'] = data.coupon_code
	let res = await proxy.$api("OrderConfirm", data.params);
	if (res.code == 0) {
		data.order = res.data;
		getCouponList(data.order.mkey)
		setAddr();
	}
}
async function getCouponList(mkey) {
	let res = await proxy.$api("OrderCoupon", {
		mkey: mkey
	},false, false);
	if (res.code == 0) {
		data.order.coupon_list = res.data || []
	}
}

function setAddr() {
	// 设置地址
	if (proxy.$store.pay_addr && proxy.$store.pay_addr.id) {
		data.order.receiver = proxy.$store.pay_addr;
	} else {
		proxy.$store.pay_addr = data.order.receiver || {
			name: '',
			id: '',
			phone: '',
			province: '',
			city: '',
			area: '',
			street: '',
			address: ''
		};
	}
}

const is_click = ref(false)
async function goPay() {

	if(!data.order.receiver || !data.order.receiver.id) {
		return proxy.$toast('请选择地址')
	}

	if(is_click.value) return
	is_click.value = true
	let res = await proxy.$api("OrderSubmit", {
		address: data.order.receiver.id || "",
		...data.params,
	});
	if (res.code === 0) {
		orderPay(res.data.order_sn);
	}
	is_click.value = false
}

async function orderPay(sn) {
	let res = await proxy.$api("OrderPay", {
		order_sn: sn
	}, true, false);
	if (res.code === 0) {
		proxy.$tools.pay(res.data).then(async _ => {
			uni.redirectTo({
				url: `/pages/pay/res?sn=${sn}&type=succ`
			})
		}).catch(_ => {
			uni.redirectTo({
				url: `/pages/pay/res?sn=${sn}&type=error`
			})
		})
	} else {
		uni.redirectTo({
			url: `/pages/pay/res?sn=${sn}&type=error`
		})
	}
}

function selectCoupon(coupon) {
	data.coupon_code = coupon.code
	getData()

}


onShareAppMessage(() => { })
onShareTimeline(() => { })
</script>

<style scoped lang="scss">
.order-confirm {
	width: 100%;
	min-height: 100vh;

	.main {
		padding: 24rpx;
		padding-bottom: 140rpx;
		min-height: auto;
	}

	.foot {
		width: 100%;
		height: 130rpx;
		background-color: #fff;
		position: fixed;
		bottom: 0;
		left: 0;
		// box-shadow: 0 -2px 8rpx #ececec;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 32rpx;

		.gobtn {
			width: 280rpx;
			height: 100rpx;
			// display: flex;
			// align-items: center;
			// justify-content: center;
			font-size: 28rpx;
			font-weight: bold;
			background-color: $main_color;
			color: #fff;
			// border-radius: 12rpx;
		}

		.c-fl {
			.ctxt {
				font-size: 24rpx;
				color: #333;
			}

			.cnum {
				font-size: 34rpx;
				font-weight: 600;
				color: #f00;
			}

			.hj {
				margin-left: 20rpx;
			}

			.yicon {
				font-weight: 600;
				color: #f00;
				position: relative;
				left: 4rpx;
				font-size: 22rpx;
			}
		}
	}
}
</style>
